<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>创建考试 - 在线考试系统</title>
    <div th:replace="include/bootstrap :: bootstrap"></div>
    <style>
        .panel {
            margin-bottom: 20px;
            background-color: #fff;
            border: 1px solid transparent;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        }
        
        .panel-heading {
            padding: 15px 20px;
            border-bottom: 1px solid #eee;
            background-color: #f8f9fa;
            border-top-left-radius: 7px;
            border-top-right-radius: 7px;
        }
        
        .panel-title {
            margin-top: 0;
            margin-bottom: 0;
            font-size: 18px;
            font-weight: 600;
            color: #2c3e50;
        }
        
        .panel-body {
            padding: 20px;
        }
        
        .form-group {
            margin-bottom: 20px;
        }
        
        .btn-primary {
            background-color: #3498db;
            border-color: #3498db;
        }
        
        .btn-primary:hover {
            background-color: #2980b9;
            border-color: #2980b9;
        }
    </style>
</head>
<body>
<div th:replace="include/TeacherNav :: TeacherNav"></div>

<script th:inline="javascript">
    $(document).ready(function() {
        // 确保内容区域被正确清空
        $(".main-content").empty();
        
        // 获取用户ID
        var userId = /*[[${session.Tlis != null ? session.Tlis.getUserid() : ''}]]*/ '';
        
        // 添加表单到main-content区域
        $(".main-content").html(`
            <div class="container-fluid">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title">创建新考试</h3>
                    </div>
                    <div class="panel-body">
                        <form class="form-horizontal" role="form" id="examPaperAction" action="/insertexam" method="post">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">试卷名称</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="pname" name="pname" type="text" placeholder="试卷名称" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">命题人</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="userid" name="userid" value="${userId}" readonly="readonly"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">所属课程</label>
                                <div class="col-sm-5">
                                    <select class="form-control" name="cno" id="cno" data-live-search="true">
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">所属班级</label>
                                <div class="col-sm-5">
                                    <select class="form-control" name="classid" id="classids">
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">单选题数量</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="singlenumber" name="singlenumber" type="text" placeholder="试卷中的单选题总量" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">每小题分数</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="singlecore" name="singlecore" type="text" placeholder="每个单选题的分值" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">多选题数量</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="multiplenumber" name="multiplenumber" type="text" placeholder="多选题数量" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">每小题分数</label>
                                <div class="col-sm-5">
                                    <input class="form-control" id="multiplecore" name="multiplecore" type="text" placeholder="每个多选题的分值" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">考试日期</label>
                                <div class="col-sm-5">
                                    <div class="row">
                                        <div class="col-sm-5">
                                            <input type="date" class="form-control" value="2023-01-01" name="examdate"/>
                                        </div>
                                        <div class="col-sm-2 text-center" style="padding-top: 6px;">至</div>
                                        <div class="col-sm-5">
                                            <input type="date" class="form-control" value="2023-01-02" name="examtime"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="testtime" class="col-sm-2 control-label">考试时长</label>
                                <div class="col-sm-5">
                                    <div class="input-group">
                                        <input class="form-control" id="testtime" name="testtime" type="text" placeholder="考试时长" />
                                        <span class="input-group-addon">分钟</span>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-offset-2 col-sm-5">
                                    <button type="submit" class="btn btn-primary btn-block">
                                        <i class="glyphicon glyphicon-ok"></i> 生成试卷
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        `);
        
        // 加载课程和班级数据
        loadCourseAndClassData();
    });
    
    function loadCourseAndClassData() {
        // 加载课程
        $.ajax({
            url: '/findAllCourse',
            type: 'get',
            success: function (data) {
                for (var i = 0; i < data.length; i++) {
                    $("#cno").append("<option value='" + data[i].cno + "'>" + data[i].cname + "</option>");
                }
            }
        });
        
        // 加载班级
        $.ajax({
            url: '/findAllClass',
            type: 'POST',
            success: function (data) {
                for (var i = 0; i < data.length; i++) {
                    $("#classids").append("<option value='" + data[i].classid + "'>" + data[i].classname + "</option>");
                }
            }
        });
    }
</script>
</body>
</html>